<template>
	<view class="content">
		  <view style="display: flex; justify-content: center; align-items: center; ">  
		    <image src="../../static/logo.jpg" mode="aspectFill"  ></image>  
		  </view>
		<view class="logoTit">PairUp</view>
		<view class="" style="margin-top: 266rpx;">
			<button type="primary" @click="$util.redirectTo('/pages/ploneLogin/ploneLogin')">手机号登录/注册</button>
			<button type="primary" class="loginType2" v-if="xyShow" @getphonenumber="getphonenumber"
				open-type="getPhoneNumber"  @click="$util.redirectTo('/uni_modules/chenzuheng-online-exam/pages/exam')" >一键授权登录</button>
			<button type="primary" class="loginType2" v-else @click="noneShow">一键授权登录</button>
		</view>
		<view class="bomPosition">
			<view class="flex_center" @click="xyShow=!xyShow">
				<view v-if="!xyShow" class="iconfont icon-yuanxingweixuanzhong grey m-r-10" style="font-size: 26rpx;">
				</view>
				<view v-else class="iconfont icon-31xuanzhong f-t m-r-10" style="font-size: 26rpx;"></view> 
				<view class="font-24"><text class="grey">我已阅读并同意PairUp</text>
				<text >《用户协议》</text>、
				<text >《隐私条款》</text>
				</view>
			</view>
		</view>
		<uv-popup ref="popup" round="20">
			<scroll-view scroll-y="true" class="scrollSty">
				<view style="display: flex;flex-direction: column;" v-html="content">
				
				</view>
			</scroll-view>
		</uv-popup>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				xyShow: false,
				code: '',
				articleA:'',
				articleB:'',
				content:''
			};
		},
		onLoad() {
			this.articleFnA('用户协议')
			this.articleFnB('隐私条款')
		},
		onShow() {
			uni.login({
				provider: 'weixin', //使用微信登录
				success: loginRes => {
					this.code = loginRes.code
				}
			});
		},
		methods: {
			articleFnA(type) {
				this.$api.sendRequest({
					url:'/api/Index/article',
					data:{
						type:type
					},success:res=>{
						this.articleA = res.data.content
					}
				})
			},
			articleFnB(type) {
				this.$api.sendRequest({
					url:'/api/Index/article',
					data:{
						type:type
					},success:res=>{
						this.articleB = res.data.content
					}
				})
			},
			openFn(type) {
				if(type=='xy') {
					this.content = this.articleA
				}else {
					this.content = this.articleB
				}
				this.$refs.popup.open('center');
			},
			noneShow() {
				uni.showToast({
					title: '请先勾选用户协议',
					icon: 'error'
				})
				return
			},
			// 手机号授权
			getphonenumber(e) {
				
				
				
				let _this = this
				if (e.detail.code) {
					uni.showLoading({
						title: '登录中'
					})

					this.$api.sendRequest({
						url: 'addons/shop/api.Login/getWechatMobile',
						data: {
							code: this.code,
							iv: e.detail.iv,
							encryptedData: e.detail.encryptedData,
							invite_id: ''
						},
						success: res => {
							if (res.code == 1) {

								if (res.data.token) {
									uni.showToast({
										title: res.msg,
										icon: 'none'
									})
									// 本地存贮
									uni.setStorage({
										key: 'token',
										data: res.data.token,
										success: (resA) => {
											setTimeout(() => {
												uni.hideLoading();
												uni.navigateBack()
											}, 1000);
										}
									});
								} else {
									uni.hideLoading();
									uni.showToast({
										title: res.msg,
										icon: 'none'
									})
								}
							} else {
								uni.showToast({
									title: res.msg,
									icon: 'error'
								})
							}
						}
					})
				} else {

				}

			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #fff;
	}
	.scrollSty {
		max-height: 760rpx;
		width: 450rpx;
		min-height: 450rpx;
		padding: 25rpx;
		background-color: #fff;
		border-radius: 20rpx;
		view {
			 word-wrap: break-word; /* 允许单词内断行 */
			  white-space: normal;   /* 处理空白符，自动换行 */
		}
	}
	.logo {
		display: block;
		margin: 0 auto;
		border-radius: 50rpx;
		
	}
	.logoTit {
		text-align: center;
		margin-top: 20rpx;
		font-size: 52rpx;
	}

	.content {
		padding-top: 284rpx;
	}

	.loginType2 {
		margin-top: 60rpx !important;
		background: #FFFFFF !important;
		border: 2rpx solid #eaeaea !important;
		color: #333 !important;
	}
</style>
